<template>
    <p>{{state.count}}</p>
    <button @click="add">add</button>
</template>
<script setup>
import {ref,markRaw,reactive} from 'vue';

const rawState = {count:0}
//markRaw用于标记一个对象，使其永远不会转变成响应式对象
//将一个对象标记为不可被转为代理。
const markedRawState = markRaw(rawState);
//返回该对象本身。
const state = reactive(markedRawState);
console.log('markedRawState',markedRawState)
console.log('state',state)
const add = ()=>state.count++;
</script>